<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Adding Images to Elements</title>
<link href="../Styles/style.css" rel="stylesheet" type="text/css" />
</head>

<body>
    
    <h2>Adding Images to Elements</h2>
    
    <p>Canvas Blocks, Image place-holders and Stickies can contain images. The images in Blocks and Stickies are icons and are resized to a maximum width and height of 100 pixels. Images can be any size but we suggest that you keep them reasonably small so as not to consume too many resources.</p>
    
    <p>To add an image to one of these elements, open the Properties window and select the element. Double-clicking the element on the Canvas will also open the Properties window. Find the Image tab in the Properties window and select the Image Chooser with the "Set Image..." option:</p>
    
    <img src="../Images/image_chooser.png" alt="image" />
    <p class="caption">Selecting the Image Chooser from the Properties window</p>
    
    <p>This will open the "My Images" Image Chooser dialog window:</p>
    
    <img src="../Images/image_chooser_dialog.png" alt="image" />
    <p class="caption">The Image Chooser dialog window</p>
    
    <p>All images that are contained in any loaded models are displayed in the Chooser so that you can re-use them. If you wish to open an image file from your computer select the "Open from File..." option.</p>
    
    <br/>
    
    <div class="boxout"><img src="../Images/tip.png" class="tipImage" alt="tip"/>You can drag and drop Image files from the desktop to the Canvas.</div>
    
    <br/>
    
    <p><strong>Removing an image from an element</strong></p>
    
    <p>To remove an image from an element select the "Remove Image" option from the Image Chooser.</p>

    <p>&nbsp;</p>

</body>
</html>
